<template>
    <div>
        <!-- 通栏组件 -->
        <AppTopnav></AppTopnav>
        <!-- 吸顶头部组件 -->
        <AppHeaderSticky></AppHeaderSticky>
        <!-- 头部组件 -->
        <AppHeader></AppHeader>
        <!-- 内容容器 -->
        <div class="app-body">
            <!-- 二级路由 -->
            <router-view></router-view>
        </div>
        <!-- 底部组件 -->
        <AppFooter></AppFooter>
    </div>
</template>

<script>
import AppTopnav from '@/components/app-topnav.vue'
import AppHeader from '@/components/app-header.vue'
import AppFooter from '@/components/app-footer.vue'
import AppHeaderSticky from '@/components/app-header-sticky.vue'


import { useStore } from 'vuex'
export default {
    name: "Layout",
    components:{
        AppTopnav,
        AppHeader,
        AppFooter,
        AppHeaderSticky
    },
    setup() {
        const store = useStore() 
        store.dispatch('category/getList')
        // console.log(store.state.ccategory.list);
    }
};
</script>
    
<style lang="less" scoped>
    .app-body {
         min-height: 600px;

    }
</style>
